<template>
	<view class="btn-list" :class="{'mright':isGifBtn}">
		<gift-layer
			v-if="giftShow"
			:linkValue="activityInfo.linkValue"
			:linkType="activityInfo.linkType"
			:dialogBgUrl="dialogBgUrl"
			:gift-list="giftList"
			@closeLayer="closeGift"
		></gift-layer>
		<view class="uni-mask" v-if="giftShow" @click="closeGift"></view>
		<image class="yin-btn" v-if="draingeImage" ref="gifBtn" @click="showDrainage()" src="https://ss.migudm.cn/mgmall/activity/yin_liu.png"></image>
		<view class="gif-btn" ref="gifBtn" @click="showGift()" v-if="isGifBtn" :style="{'background-image': 'url(' + iconUrl + ')' }"></view>
		<goods-history-btn v-if="isShowHistory==1" class="margin-top"></goods-history-btn>
		<!-- 购物车悬浮按钮 -->
		<goods-cart-btn v-if="isShowCart==1" class="margin-top" position="unset"></goods-cart-btn>
		<begin-minute-btn v-if='isShowBeginMinute' :beginHeight='beginHeight' class="margin-top"></begin-minute-btn>
		<back-top-btn class="margin-top" ref="backTopView" position="unset"></back-top-btn>
		<customer-service ref="service"></customer-service>
		<subscribe-mask class="subscribe-mask"
						ref="subscribeMaskRef"
						@touchmove.stop
						v-if="subscribeShow"
						:top="subscribeTop"
						:left="subscribeLeft"
						@close="handleSubscribeClose"
		></subscribe-mask>
	</view>
</template>

<script>
import beginMinuteBtn from '@/components/userDefinedPage/beginMinuteBtn/beginMinuteBtn.vue';
import giftLayer from '@/components/userDefinedPage/gift-layer.vue';
import goodsCartBtn from '@/components/userDefinedPage/goodsCartBtn/goodsCartBtn.vue';
import goodsHistoryBtn from '@/components/userDefinedPage/goodsHistoryBtn.vue';
import customerService from '@/common/public/customerService.vue'
import config from '@/config.js'
import subscribeMask from '@/components/subscribeMask'
import Channel from '@/module/channel'
import ShopCar from '@/module/shopCar'; // 引入Channel类
export default {
	components: {goodsCartBtn,goodsHistoryBtn,giftLayer,customerService, subscribeMask,beginMinuteBtn},
	data() {
		return {
			giftShow: false,
			giftList: [],
			gifScale: uni.getSystemInfoSync().windowWidth / 750,
			isGifBtn: false, //是否展示活动悬浮窗按钮
			activityId: '', //悬浮窗活动ID
			iconUrl: '', //悬浮图标
			dialogBgUrl: '', //弹窗底图
			activityInfo: {} ,//弹窗活动数据
			isShowCart:0,//1展示购物车
			isShowHistory:0,//1展示浏览记录
			subscribeShow: false, // 订阅蒙板
			subscribeTop: '', // 订阅蒙板top
			subscribeLeft: '' ,// 订阅蒙板left
			isShowBeginMinute:'', //秒杀即将开始
			beginHeight:0,//秒杀即将开始距离顶部的高度
		}
	},
	computed: {
		draingeImage() {
			return this.$globalData.state.frontConfig.draingeImage
		}
	},
	methods: {
		setIsShowBeginMinute(isShowBeginMinute,height){
			this.isShowBeginMinute = isShowBeginMinute;
			this.beginHeight = height;
		},
		watchBackTop(scrollTop){
			this.$refs.backTopView.viewBtn(scrollTop)
		},
		setIsShowCart(isShowCart){
			if (isShowCart) ShopCar.getShopingCartNum()
			this.isShowCart = isShowCart;
		},
		setIsShowHistory(isShowHistory){
			this.isShowHistory = isShowHistory;
		},
		closeGift() {
			this.giftShow = false;
		},
		showGift() {
			let parJson = {
				activityId: this.activityId // 活动id
			};
			if (this.activityInfo.linkType == '109') {
				this.$request('marketing/queryCouponListByActivityId', parJson).then(data => {
					this.giftList = data.couponItemList;
					this.giftShow = true;
				});
			} else if (this.activityInfo.linkType == '110' && this.dialogBgUrl) {
				this.giftShow = true;
			} else if (this.activityInfo.linkType == '111') {//联系客服
				this.$refs.service.showBox();
			} else if (this.activityInfo.linkType == '120'){
				if (config.appType == 'H5') {
					this.giftShow = true;
				} else {
					uni.previewImage({
						urls: [this.activityInfo.linkValue]
					})
				}
			} else if (this.activityInfo.linkType == '105' && this.activityInfo.linkValue.includes('pages/goods/subscribe/mySubscribe')) {
				var statInfo = {'Ref_Module_Type':this.activityInfo.linkType,'Ref_Module_ID':'1005','Ref_Module_Inner_Order':1}
				this.$Login.checkLoginingblock(() => {
					console.log('linkValue', this.activityInfo.linkValue);
					this.$routeUtils.navigateTo({url: this.activityInfo.linkValue})
				})
			} else if (this.activityInfo.linkType == '131'){
					this.$routeUtils.navigateTo({
					url: "/package_activity/coupon/list?fragmentId=" + this.activityInfo.id
					});
			}
			else{
				var statInfo = {'Ref_Module_Type':this.activityInfo.linkType,'Ref_Module_ID':'1005','Ref_Module_Inner_Order':1}
				this.$utils.handleLink(this.activityInfo.linkType, this.activityInfo.linkValue,{},{statInfo:statInfo});
			}
		},
		setGiftLayer(obj,id){
			this.activityInfo = obj;
			this.isGifBtn = id ? true : false;
			console.log('有进来的是什么id', id, this.isGifBtn)
			this.activityId = this.activityInfo.linkValue;
			this.iconUrl = this.activityInfo.iconUrl;
			this.dialogBgUrl = this.activityInfo.dialogBgUrl;
			if(this.activityInfo.linkType == '120'){
				this.dialogBgUrl = this.activityInfo.linkValue;
			}
			if (this.activityInfo.linkType == '131'){
				this.activityInfo.id = id //碎片id 优惠券需要用到 
			}
			var mThis = this;
			// 如果是订阅
			if(this.activityInfo.linkType == '105' && this.activityInfo.linkValue.includes('pages/goods/subscribe/mySubscribe')){
				// 判断是否是首次进入
				Channel.checkChannelBack(()=>{
					const channelId = this.$globalData.state.channelId
					let subscribeChannel = uni.getStorageSync('subscribeChannel') || []
					console.log('list---', subscribeChannel);
					console.log('refs', typeof channelId, channelId);
					if (!subscribeChannel || !subscribeChannel.includes(channelId)) {
						this.$nextTick(()=> {
							this.setSubscribeMaskPosition()
							this.subscribeShow = true
							// #ifdef H5
							document.body.style.overflow='hidden';
							// #endif
							subscribeChannel.push(channelId)
							uni.setStorageSync('subscribeChannel', subscribeChannel)
						})
					}
				})
			}
			//首页弹窗打开
			var showGiftInfo = uni.getStorageSync('showGiftInfo');
			//取缓存根据活动ID，判断是否是首次打开
			if (!showGiftInfo || (showGiftInfo && this.activityId != showGiftInfo.activityId)) {
				if (this.activityInfo.linkType == '109' || (this.activityInfo.linkType == '110' && this.dialogBgUrl)) {
					setTimeout(() => {
						mThis.showGift();
						uni.setStorageSync('showGiftInfo', { activityId: this.activityInfo.linkValue });
					}, 500);
				}
			}
		},
		showDrainage() {
			uni.previewImage({
				urls: [this.draingeImage]
			})
		},
		handleSubscribeClose() {
			// #ifdef H5
			document.body.style.overflow='';
			// #endif
			this.giftShow = false;
			this.subscribeShow = false
			// this.showGift();
		},
		setSubscribeMaskPosition() {
			uni.createSelectorQuery()
				.in(this)
				.select('.btn-list')
				.boundingClientRect(rect => {
					console.log('??',rect, this.$refs.subscribeMaskRef)
					this.subscribeTop = rect.top - 5 + 'px'
					this.subscribeLeft = rect.left - 9 + 'px'
				}).exec()
		}
	},
};
</script>

<style lang="scss" scoped>
	.btn-list{
		position: fixed;
		bottom: 130rpx;
		right: 30rpx;
		z-index: 10;
		margin-bottom: env(safe-area-inset-bottom);
	}
	.mright{
		right: 18rpx;
	}
	.yin-btn{
		width: 120rpx;
		display: block;
		height: 120rpx;
		margin-bottom: 20rpx;
	}
	.margin-top{
		margin: 0 auto;
		margin-top: 40rpx;
	}
	.gif-btn {
		// background-image: url('~@/static/img/giftLayer/gift_sprite.png');
		width: 120rpx;
		height: 120rpx;
		background-repeat: no-repeat;
		// animation: myAnimation 2.00s steps(1) infinite;
		background-size: 100% 100%;
		display: inline-block;
		z-index: 10;
		margin-bottom: env(safe-area-inset-bottom);
		position: relative;
	}
	.uni-mask {
		width: 750rpx;
		height: 100vh;
		position: fixed;
		top: 0;
		left: 0;
		z-index: 99;
		background: rgba(0, 0, 0, 0.6);
	}
	.subscribe-mask {
		position: fixed;
		height: 100vh;
		overflow: hidden;
		top: 0;
		left: 0;
		bottom: 0;
		right: 0;
		z-index: 10000;
		display: flex;
		justify-content: center;
		align-items: center;
	}
</style>
